<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="css/base.css">
  <link rel="stylesheet" href="css/my.css">
  <meta name="viewport" content="width=device-width, initial-scale=1.0,maximum-scale=1, user-scalable=no">
</head>
<body>
<div class="header-box">
  <p id="pro_more_title">鱼币任务详情</p>
</div>
<div class="yubitask">
  <div class="yubitask_box">
    <table></table>
    <p id="yubi_title">鱼币任务 <img id="img1" src="img/my/xiangshang@2x.png"></p>
    <ul id="yubitask_list">
      <li>
        <p>坚持会养成习惯</p>
        <span>每日打卡</span>
        <b>+5</b>
      </li>
      <li>
        <p>助人会带来快乐</p>
        <span>评价绘本</span>
        <b>+5</b>
      </li>
      <li>
        <p>效率会带来效益</p>
        <span>4天内还书</span>
        <b>+50</b>
      </li>
      <li>
        <p>分享是一种美德</p>
        <span>邀请好友</span>
        <b>+50</b>
      </li>
      <li>
        <p>环保+奉献=收入</p>
        <span>分享绘本</span>
        <b>+100</b>
      </li>
      <li>
        <p>守规则就是支持</p>
        <span>完善个人信息</span>
        <b>+200</b>
      </li>
    </ul>
  </div>
</div>
<div class="huise4"></div>
<div class="yubidetail">
  <div class="yubidetail_box">
    <table></table>
    <p id="yubidetail_title">鱼币详情 <img id="img2" src="img/my/xiangshang@2x.png"></p>
    <ul id="yubidetail_list">
      <li>
        <p>今天</p>
        <span>每日打卡</span>
        <b>+5</b>
      </li>
      <li>
        <p>今天</p>
        <span>完善个人资料</span>
        <b>+200</b>
      </li>
      <li>
        <p>06-09</p>
        <span>每日打卡</span>
        <b>+5</b>
      </li>
      <li>
        <p>06-01</p>
        <span>每日打卡</span>
        <b>+5</b>
      </li>
      <li>
        <p>05-22</p>
        <span>开启绘本分享之旅</span>
        <b>+100</b>
      </li>
      <li>
        <p>05-22</p>
        <span>每日打卡</span>
        <b>+5</b>
      </li>
    </ul>
  </div>
</div>
<div class="footer_kb"></div>
<div class="footer_kb1"></div>
</body>
<script src="js/jquery.js"></script>
<script src="js/base.js"></script>
<script>
  var isshowdetail1=false;
  var isshowdetail2=false;
  $('#img1').click(function () {
     if (isshowdetail1){
       isshowdetail1=false;
       $('#yubitask_list').show();
       $(this).attr("src","img/my/xiangshang@2x.png");
     } else {
       isshowdetail1=true;
       $('#yubitask_list').hide();
       $(this).attr("src","img/my/xiangxia@2x.png");
     }
  });
  $('#img2').click(function () {
    if (isshowdetail2){
      isshowdetail2=false;
      $('#yubidetail_list').show();
      $(this).attr("src","img/my/xiangshang@2x.png");
    } else {
      isshowdetail2=true;
      $('#yubidetail_list').hide();
      $(this).attr("src","img/my/xiangxia@2x.png");
    }
  });
</script>
</html>